'use strict';
/**
 * Created by FreezeSoul on 2016/1/23.
 */
define([
    "app/core/base",
    "jquery",
    "underscore",
    'JSONParse',
    'loglevel',
    "echarts"
], function (Chart, $, _, JSON, log, ec) {

    //TODO:自定义组件属性
    var property = {
        //标题文本
        TitleText: undefined,
        //标题颜色
        TitleColor: undefined,
        //副标题文本
        SubTitleText: undefined,
        //副标题颜色
        SubTitleColor: undefined,
        //热度颜色
        HeatColors: undefined,
        //图例位置
        HeatPosition: undefined,
        //背景色
        BackgroundColor: undefined,
        //标题位置
        TitlePosition: undefined,
        //轴字体颜色
        AxisTextColor: undefined,
        //是否显示工具栏
        IsShowToolbox: undefined,
        //需要针对组件映射属性至组件Option
        MapOption: function (option) {
            var _this = this;

            //标题
            if (this.TitleText) {
                $.extend(true, option, {title: {text: _this.TitleText}});
            }

            //标题颜色
            if (this.TitleColor) {
                $.extend(true, option, {title: {textStyle: {color: _this.TitleColor}}});
            }

            //副标题
            if (this.SubTitleText) {
                $.extend(true, option, {title: {subtext: _this.SubTitleText}});
            }

            //副标题颜色
            if (this.SubTitleColor) {
                $.extend(true, option, {title: {subtextStyle: {color: _this.SubTitleColor}}});
            }

            //背景色设置
            if (this.BackgroundColor) {
                option.backgroundColor = this.BackgroundColor;
            }

            //标题位置设置
            if (this.TitlePosition) {
                $.extend(true, option, {
                    title: {
                        x: _this.TitlePosition.split(',')[0],
                        y: _this.TitlePosition.split(',')[1]
                    }
                });
            }

            //图例位置设置
            if (this.HeatPosition) {
                $.extend(true, option.visualMap, {
                    left: _this.HeatPosition.split(',')[0],
                    top: _this.HeatPosition.split(',')[1]
                });
            }

            //轴字体边框颜色
            if (this.AxisTextColor) {
                $.extend(true, option.xAxis, {
                    axisLine: {
                        lineStyle: {
                            color: _this.AxisTextColor
                        }
                    },
                    axisTick: {
                        lineStyle: {
                            color: _this.AxisTextColor
                        }
                    },
                    axisLabel: {
                        textStyle: {
                            color: _this.AxisTextColor
                        }
                    },
                    nameTextStyle: {
                        color: _this.AxisTextColor
                    }
                });
                $.extend(true, option.yAxis, {
                    axisLine: {
                        lineStyle: {
                            color: _this.AxisTextColor
                        }
                    },
                    axisTick: {
                        lineStyle: {
                            color: _this.AxisTextColor
                        }
                    },
                    axisLabel: {
                        textStyle: {
                            color: _this.AxisTextColor
                        }
                    },
                    nameTextStyle: {
                        color: _this.AxisTextColor
                    }
                });
            }

            //热度颜色
            if (this.HeatColors
                && this.HeatColors.length > 0) {
                $.extend(true, option.visualMap, {
                    inRange: {
                        color: _this.HeatColors
                    }
                });
            }

            if (this.IsShowToolbox) {
                $.extend(true, option, {
                    toolbox: {
                        show: true,
                        feature: {
                            restore: {show: true},
                            saveAsImage: {show: true}
                        }
                    }
                });
            }
        }
    };

    var heatmap = Chart.extend({
        constructor: function (layout) {
            this._layout = layout;
            this._chart = null;
            this._option = {
                Binding: [],
                Events: [],
                Extend: $.extend({}, property),
                Option: {
                    title: {
                        text: 'Demo of Heatmap',
                        subtext: 'Demo of Heatmap'
                    },
                    tooltip: {
                        position: 'top'
                    },
                    animation: false,
                    xAxis: {
                        type: 'category',
                        data: ['12a', '1a', '2a', '3a', '4a', '5a', '6a',
                            '7a', '8a', '9a', '10a', '11a',
                            '12p', '1p', '2p', '3p', '4p', '5p',
                            '6p', '7p', '8p', '9p', '10p', '11p']
                    },
                    yAxis: {
                        type: 'category',
                        data: ['Saturday', 'Friday', 'Thursday',
                            'Wednesday', 'Tuesday', 'Monday', 'Sunday']
                    },
                    visualMap: {
                        min: 1,
                        max: 10,
                        calculable: true,
                        orient: 'horizontal',
                        left: 'center',
                        top: 'bottom'
                    },
                    series: [{
                        name: 'Punch Card',
                        type: 'heatmap',
                        data: [[0, 0, 5], [1, 0, 1], [2, 0, "-"], [3, 0, "-"], [4, 0, "-"], [5, 0, "-"], [6, 0, "-"], [7, 0, "-"], [8, 0, "-"], [9, 0, "-"], [10, 0, "-"], [11, 0, 2], [12, 0, 4], [13, 0, 1], [14, 0, 1], [15, 0, 3], [16, 0, 4], [17, 0, 6], [18, 0, 4], [19, 0, 4], [20, 0, 3], [21, 0, 3], [22, 0, 2], [23, 0, 5], [0, 1, 7], [1, 1, "-"], [2, 1, "-"], [3, 1, "-"], [4, 1, "-"], [5, 1, "-"], [6, 1, "-"], [7, 1, "-"], [8, 1, "-"], [9, 1, "-"], [10, 1, 5], [11, 1, 2], [12, 1, 2], [13, 1, 6], [14, 1, 9], [15, 1, 11], [16, 1, 6], [17, 1, 7], [18, 1, 8], [19, 1, 12], [20, 1, 5], [21, 1, 5], [22, 1, 7], [23, 1, 2], [0, 2, 1], [1, 2, 1], [2, 2, "-"], [3, 2, "-"], [4, 2, "-"], [5, 2, "-"], [6, 2, "-"], [7, 2, "-"], [8, 2, "-"], [9, 2, "-"], [10, 2, 3], [11, 2, 2], [12, 2, 1], [13, 2, 9], [14, 2, 8], [15, 2, 10], [16, 2, 6], [17, 2, 5], [18, 2, 5], [19, 2, 5], [20, 2, 7], [21, 2, 4], [22, 2, 2], [23, 2, 4], [0, 3, 7], [1, 3, 3], [2, 3, "-"], [3, 3, "-"], [4, 3, "-"], [5, 3, "-"], [6, 3, "-"], [7, 3, "-"], [8, 3, 1], [9, 3, "-"], [10, 3, 5], [11, 3, 4], [12, 3, 7], [13, 3, 14], [14, 3, 13], [15, 3, 12], [16, 3, 9], [17, 3, 5], [18, 3, 5], [19, 3, 10], [20, 3, 6], [21, 3, 4], [22, 3, 4], [23, 3, 1], [0, 4, 1], [1, 4, 3], [2, 4, "-"], [3, 4, "-"], [4, 4, "-"], [5, 4, 1], [6, 4, "-"], [7, 4, "-"], [8, 4, "-"], [9, 4, 2], [10, 4, 4], [11, 4, 4], [12, 4, 2], [13, 4, 4], [14, 4, 4], [15, 4, 14], [16, 4, 12], [17, 4, 1], [18, 4, 8], [19, 4, 5], [20, 4, 3], [21, 4, 7], [22, 4, 3], [23, 4, "-"], [0, 5, 2], [1, 5, 1], [2, 5, "-"], [3, 5, 3], [4, 5, "-"], [5, 5, "-"], [6, 5, "-"], [7, 5, "-"], [8, 5, 2], [9, 5, "-"], [10, 5, 4], [11, 5, 1], [12, 5, 5], [13, 5, 10], [14, 5, 5], [15, 5, 7], [16, 5, 11], [17, 5, 6], [18, 5, "-"], [19, 5, 5], [20, 5, 3], [21, 5, 4], [22, 5, 2], [23, 5, "-"], [0, 6, 1], [1, 6, "-"], [2, 6, "-"], [3, 6, "-"], [4, 6, "-"], [5, 6, "-"], [6, 6, "-"], [7, 6, "-"], [8, 6, "-"], [9, 6, "-"], [10, 6, 1], [11, 6, "-"], [12, 6, 2], [13, 6, 1], [14, 6, 3], [15, 6, 4], [16, 6, "-"], [17, 6, "-"], [18, 6, "-"], [19, 6, "-"], [20, 6, 1], [21, 6, 2], [22, 6, 2], [23, 6, 6]],
                        label: {
                            normal: {
                                show: true
                            }
                        },
                        itemStyle: {
                            emphasis: {
                                shadowBlur: 10,
                                shadowColor: 'rgba(0, 0, 0, 0.5)'
                            }
                        }
                    }]
                }
            };
        },
        init: function (element) {
            try {
                this._chart = ec.init(element, null, {
                    renderer: 'canvas'
                });
                this._bindEvent();
            } catch (e) {
                log.error(e);
            }
        },
        //TODO:需要重写的部分
        _bindEvent: function () {
            var _this = this;
            this._chart.on("click", function (param) {
                if (_this._layout
                    && _this._layout.navigate
                    && _this._option.Events
                    && _this._option.Events.length > 0) {

                    var registerEvent = _.findWhere(_this._option.Events, {Event: "HeatClick"});
                    if (registerEvent) {
                        var pageId = registerEvent.PageId;
                        var params = registerEvent.Params;
                        var args = [];
                        var xParam = _.findWhere(params, {Value: "xAxis"});
                        if (xParam && xParam.ParamName) {
                            args.push({
                                ParamName: xParam.ParamName,
                                ParamValue: ''
                            });
                        }
                        var yParam = _.findWhere(params, {Value: "yAxis"});
                        if (yParam && yParam.ParamName) {
                            args.push({
                                ParamName: yParam.ParamName,
                                ParamValue: ''
                            });
                        }
                        var vParam = _.findWhere(params, {Value: "Value"});
                        if (vParam && vParam.ParamName) {
                            args.push({
                                ParamName: vParam.ParamName,
                                ParamValue: ''
                            });
                        }

                        _this._layout.navigate(pageId, args);
                    }
                    param.event.event.preventDefault();
                }
            });
        },
        example: function () {
            try {
                this._chart.setOption(this._option.Option, true);
            } catch (e) {
                log.error(e);
            }
        },
        _readProperty: function () {
            try {
                if (!this._option.Extend) return;
                var propertyCopy = $.extend(true, {}, property);
                $.extend(true, propertyCopy, this._option.Extend);
                propertyCopy.MapOption(this._option.Option);
            } catch (e) {
                log.error(e);
            }
        },
        //TODO:需要重写的部分
        _bindData: function (data) {
            var binding = this._option.Binding[0];
            var table = data[binding.DataSetCode];
            if (table && table.length > 0
                && binding.Dimensions && binding.Dimensions.length > 0
                && binding.Measures && binding.Measures.length > 0) {
                var yAxisData = [];
                var dimension = binding.Dimensions[0].Column;
                $.each(table, function (j, row) {
                    yAxisData.push(row[dimension]);
                });
                this._option.Option.yAxis.data = yAxisData;
                var xAxisData = [];
                $.each(binding.Measures, function (j, measure) {
                    xAxisData.push(measure.Name);
                });
                this._option.Option.xAxis.data = xAxisData;
                var maxValue = 0;
                var seriesValues = [];
                for (var y = 0; y < table.length; y++) {
                    for (var x = 0; x < binding.Measures.length; x++) {
                        var row = table[y];
                        var measure = binding.Measures[x].Column;
                        var value = parseFloat(row[measure]);
                        maxValue = Math.max(maxValue, value);
                        seriesValues.push([x, y, value == 0 ? '-' : value])
                    }
                }
                if (!this._option.Option.series || this._option.Option.series.length == 0) {
                    this._option.Option.series = [{}];
                }
                this._option.Option.series[0].data = [];
                $.extend(true, this._option.Option.series[0], {
                    name: binding.DataSetCode,
                    type: 'heatmap',
                    data: seriesValues
                });
                if (this._option.Option.visualMap.max < maxValue) {
                    this._option.Option.visualMap.max = maxValue;
                }
            }
        },
        setData: function (data) {
            try {
                this._readProperty();

                if (data
                    && this._option.Binding
                    && this._option.Binding.length > 0
                    && this._option.Extend) {

                    this._bindData(data);

                    this._readProperty();
                }
                this._chart.setOption(this._option.Option, true);
            } catch (e) {
                log.error(e);
            }
        },
        setOption: function (option) {
            try {
                return this._option = $.extend(true, {}, option);
            } catch (e) {
                log.error(e);
            }
        },
        getOption: function () {
            try {
                this._readProperty();
            } catch (e) {
                log.error(e);
            }
            return this._option;
        },
        setTheme: function (theme) {
            try {
                this._chart.setTheme(theme);
            } catch (e) {
                log.error(e);
            }
        },
        resize: function () {
            try {
                this._chart.resize();
            } catch (e) {
                log.error(e);
            }
        },
        showLoading: function () {
            try {
                if (this._layout && this._layout.showLoading) {
                    this._layout.showLoading(this);
                }
            } catch (e) {
                log.error(e);
            }
        },
        hideLoading: function () {
            try {
                if (this._layout && this._layout.hideLoading) {
                    this._layout.hideLoading(this);
                }
            } catch (e) {
                log.error(e);
            }
        },
        dispose: function () {
            try {
                this._chart.dispose();
            } catch (e) {
                log.error(e);
            }
        },
        getElement: function () {
            return null;
        },
        getChart: function () {
            return this._chart;
        }
    });

    return heatmap;
});